.alert-container {
    width: 100%;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    z-index: $zindex-modal + 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-content: center;
    padding: 0 $grid-gutter-width / 2;

    .alert {
        margin-bottom: .5rem;
        border-radius: $border-radius;
        @include box-shadow($z-depth-1-half);

        &:first-child {
            margin-top: .5rem;
        }

        &:hover {
            @include box-shadow($z-depth-3);
        }
    }

    .modal-open & {
        .alert {
            @include box-shadow($z-depth-3);

            &:hover {
                @include box-shadow($z-depth-4);
            }
        }
    }
}

.alert--top {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 3.125rem;
    margin: 0;
    width: 100%;
    border-bottom: $alert-border-width solid rgba($success, .85);
    border-radius: 0;
}

.alert-container alert--top {

}

.alert--with-icon {
    position: relative;
    padding-left: 2.5rem;

    &::before {
        @extend %far;
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 2.5rem;
        text-align: center;
        left: 0;
    }

    &.alert-info {
        &::before {
            @extend %fa-info-circle;
        }
    }

    &.alert-danger {
        &::before {
            @extend %fa-exclamation-triangle;
        }
    }

    &.alert-success {
        &::before {
            @extend %fa-badge-check;
        }
    }

    &.alert-warning {
        &::before {
            @extend %fa-exclamation-circle;
        }
    }
}

.alert-body {
  padding-right: 2.5rem;
}

.alert-progress {
    position: absolute;
    left: -1px;
    bottom: -1px;
    height: .25rem;
    background-color: #000000;
    opacity: 0.4;
    border-radius: .25rem;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
    filter: alpha(opacity=40);
}